<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>联系我们</title>
    <script src="./vue.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="./set.js"></script>

    <style>
        * {
            margin: 0;
            padding: 0;
        }
    
        html {
            font-size: 62.5%;
        }
    
        img {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%;
        }
    
        .main {
            width: 90%;
            margin: 20px auto;
            background: #f2f1f6;
            height: 600px;
            font-family: PingFangSC-Regular;
            border-radius: 6px;
            box-shadow: 0 1px 5px #e8e5ee;
            overflow: hidden;
        }
    
        .back {
            width: 60px;
            float: right;
            margin-top: 20px;
            color: rgba(0, 0, 0, 0.4);
            font-size: 12px;
            color: #95989F;
            letter-spacing: 0.45px;
        }
    
        .service {
            clear: both;
            margin: 0 auto;
        }
    
        .service img {
            width: 34px;
            vertical-align: middle;
            margin-top: 21px;
            border-radius: 17px;
        }
    
        .line {
            color: rgba(0, 0, 0, 0.2);
            margin-top: 15px;
            margin-bottom: 30px;
        }
    
        .qrcodeBox {
            margin-top: 15px;
        }
    
        .words {
            display: block;
            margin-top: 10px;
            font-size: 15px;
            color: #979797;
            letter-spacing: -0.05px;
        }
    
        .marginTop {
            margin-top: 100px;
        }
    
        .qrcodeBox img {
            width: 150px;
            height: 150px;
        }
    
        .center {
            text-align: center;
        }
    </style>
</head>


<body>
    
    <div id="wrapp">
        <div class="main">

            <div class="service marginTop center">
                <img src="./assets/touxiang.jpg" alt="">
            </div>
            <span class="words center">客服小蕊</span>
            <div class="qrcodeBox center">
                <img src="./assets/erweima.jpg" alt="">
            </div>
            <span class="words center">微信号：kefu_xr</span>
            <div class="back" @click="backTo">返回&nbsp;&nbsp;&nbsp;></div>
        </div>

    </div>
    <script>
        let app = new Vue({
            el: "#wrapp",
            data: {
                session: ''
            },
            created() {
                this.session = this.parseURL().session;
            },
            methods: {
                //点击返回，跳转至新页面
                backTo() {
                    this.newUrl = appUrl + "index.html?session=" + this.session;
                    window.location.href = this.newUrl;
                },
                parseURL: function (_url) {
                    let queryString = '';
                    let url = _url || location.href;
                    let index = url.lastIndexOf('?');
                    let map = {};
                    /* 如果当前 url 没有 query-string*/
                    if (index > -1) {
                        let queryString = url.slice(index).split('?')[1];
                        queryString.split('&').forEach(function (item) {
                            let t = item.split('=');
                            map[t[0]] = t[1];
                        });
                    }
                    return map;
                },
            }
        })
    </script>
</body>

</html>